.editor_container {
  width: 100%;
  height: 500px;
  display: flex;
  flex-direction: column;
  outline: 1px solid red;
  border-radius: var(--baseBorderRadius);
  padding: 10px;
}
.editor_container .editor_tools {
  margin-bottom: 5px;
}
.editor_content {
  flex: 1;
  overflow: hidden;
}
.editor_main {
  width: 100%;
  height: 100%;
  border: 1px solid #ccc;
  border-radius: var(--baseBorderRadius);
  padding: 10px;
  overflow: auto;
  transition: border-color 0.3s ease;
  font-family: Menlo, Consolas, monospace;
}
.editor_main[contenteditable] {
  outline: none;
  color: #2d2d2e;
}
.editor_main[contenteditable]::selection {
  background-color: #abcdff;
}
.editor_main:focus {
  border-color: #24c166;
}

.editor_main[contenteditable]:empty:before {
  content: var(--placeholder);
  color: gray;
  font-style: italic;
}
.editor_main p {
  color: red;
}
:deep(.editor_main ul),
:deep(.editor_main ol) {
  list-style: initial;
  padding-left: 20px;
}
